<template>
  <div class="wrapper">
	  <el-container>
	        <el-header>
				<div  class="returnhome" @click="returnhome" style="align-self: center; margin-right: 30px;cursor: pointer;"><L/></div>
				<FB style="align-self: center; margin-right: 30px;margin-left: 160px;"/>
				<div style="align-self: center; justify-content: center;color:#787878;">
					问题反馈
				</div>
			</el-header>
	        <el-main>
				<div class="main">
					<div style="flex: 2;"></div>
					<div style="flex: 8; ">
						<p><span style="font-size: 2rem; margin-right: 20px;" >问题</span>如果您在使用过程中遇到任何系统相关的问题，欢迎您向我们反馈。</p>
						<p>或者您对系统的优化有任何建议，也欢迎您的分享。<span style="font-size: 2rem; margin-left: 20px;" >建议</span></p>
						<div style="display: flex; flex-direction: row;margin-top: 50px;margin-bottom: 50px;">
							<div style="flex: 1;"></div>
							<el-card style="flex: 10;box-shadow: 3px 3px 50px 20px #c9f5ae; background-color: #c9f5ae;border: 0;">
								<img 
								src="http://127.0.0.1/src/assets/images/2VM.jpg"
								width=100%
								/>
							</el-card>
							<div style="flex: 14;padding-left: 110px;padding-top: 12%;display: flex;flex-direction: row;">
								<L style="margin-top: 20px;margin-right: 8px;color:#787878;"/>
								<div>
									<p>扫描左侧二维码，向我们留言反馈。</p>
									<p> <span style="font-size: 2rem; margin-right: 20px;" >扫码反馈</span>我们将认真处理您的反馈。</p>
								</div>
								<p></p>
							</div>
						</div>
						
					</div>
					<div style="flex: 2;"></div>
				</div>
			</el-main>
	      </el-container>
  </div>
</template>

<script setup>
import FB from '@/components/icons/feedback'
import L from '@/components/icons/left'
import router from '@/router';
	import { useRoute } from 'vue-router';
	function returnhome (){
		router.push({ name: 'Indexmainfooter' })
	}
</script>

<style scoped lang="scss">
.wrapper{
	width: 100vw;
	height: 100vh;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	background-color: rgb(211, 241, 201 ,0.7);
}
.el-header{
	text-align: left;
	display: flex;
	flex-direction: row;
	font-size: 2.5rem;
	font-weight: 600;
	font-style:italic;
	height: 120px;
	background: linear-gradient(#d1d1f4, rgb(211, 241, 201 ,0.0));
	
}
.main{
	display: flex;
	flex-direction: row;
	
}
p{
	font-weight: 400;
	font-style:italic;
	color:#787878;
	margin-top: 10px;
}
.returnhome{
	color:#787878;
}
.returnhome:hover{
	color: #00aaff;
}
.returnhome:active{
	color: #787878;
}
</style>